<template>
  <div class="w-full min-h-full flex flex-col justify-between items-start flex-wrap">
    <div class="w-full flex-initial h-10 flex justify-start items-center pl-3 pt-2 space-x-2">
      <div class="w-1/5">
        <n-input v-model:value="searchtext" type="text" placeholder="请输入搜索的内容"/>
      </div>
      <div class="w-1/10">
        <n-select v-model:value="fenlei" :options="options" placeholder="请选择搜索范围"/>
      </div>
      <n-button type="primary" class="w-20">搜索</n-button>
    </div>
    <div class="w-full flex-1 flex flex-wrap justify-start items-start content-start">
      <div class="w-1/5 h-48 p-3" v-for="(item,index) in addresses" :key="index">
        <div class="w-full h-full border bg-blue-200 p-2 flex flex-col justify-start items-start relative">
          <div class="h-20 w-full juzhong">
            <tupian :src="item.touxiang"></tupian>
          </div>
          <div class="w-full juzhong">
            <span>姓名：</span>
            <span class="text-blue-500">{{ item.name }}</span>
          </div>
          <div class="w-full juzhong">
            <span>电话：</span>
            <span>{{ item.phone[0] }}</span>
          </div>
          <div class="w-full juzhong">
            <span>邮箱：</span>
            <span>{{ item.email[0] }}</span>
          </div>
          <div class="absolute inset-0 bg-white bg-opacity-0 hover:bg-opacity-30 cursor-pointer select-none"
               @click="openitem(item)"></div>
        </div>
      </div>
    </div>
    <fenye :totalnum="1000" class="flex-initial"></fenye>
  </div>
  <zhezhao showclose v-model:dialogVisible="dialogstatus" @close="guanbi">
    <div class="w-160 p-5 overflow-x-hidden overflow-y-auto bg-white flex flex-col justify-start items-center">
      <tupian :src="dialogdata.touxiang" class="w-80"></tupian>
      <div class="w-full juzhong">
        <span>姓名：</span>
        <span class="text-blue-500">{{ dialogdata.name }}</span>
        <n-button size="mini" class="mx-2" type="primary" v-clipboard:success="chenggong" v-clipboard:error="shibai"
                  v-clipboard="dialogdata.name">复制
        </n-button>
      </div>
      <div class="w-full juzhong" v-for="item in dialogdata.phone">
        <span>电话：</span>
        <span>{{ item }}</span>
        <n-button size="mini" class="mx-2" type="primary" v-clipboard="item" v-clipboard:success="chenggong"
                  v-clipboard:error="shibai">复制
        </n-button>
      </div>
      <div class="w-full juzhong" v-for="item in dialogdata.email">
        <span>邮箱：</span>
        <span class="truncate">{{ item }}</span>
        <n-button size="mini" class="mx-2" type="primary" v-clipboard="item" v-clipboard:success="chenggong"
                  v-clipboard:error="shibai">复制
        </n-button>
      </div>
      <div class="w-full juzhong" v-for="item in dialogdata.address">
        <span>地址：</span>
        <span>{{ item }}</span>
        <n-button size="mini" class="mx-2" type="primary" v-clipboard="item" v-clipboard:success="chenggong"
                  v-clipboard:error="shibai">复制
        </n-button>
      </div>
      <div>{{ dialogdata.beizhu }}</div>
    </div>
  </zhezhao>
</template>

<script>
//解构
import {ref, defineComponent} from "vue"
import {NDialogProvider, NDialog, NButton, useMessage, NInput, NSelect} from "naive-ui"
import {useStore} from "vuex";
import {useRoute, useRouter} from "vue-router";
//模块化
export default defineComponent({
  name: 'Addresslist',//组件名称
  props: {
    //接收父组件数据
  },
  components: {
    NDialogProvider, NDialog, NButton, NInput, NSelect
  },
  setup(prop, content) {
    //  这里没有this,直接使用props里数据
    const store = useStore()
    const route = useRoute()
    const router = useRouter()
    const message = useMessage()
    const addresses = ref([
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      }, {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
      {
        name: "名字预留地",
        touxiang: "https://img0.baidu.com/it/u=228436383,3520321118&fm=26&fmt=auto",
        phone: ["13697687917", "13697687917", "13697687917", "13697687917",],
        address: ["四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号", "四川省成都市青羊区江汉路91号",],
        email: ["dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs", "dfsdfsdfs",],
        beizhu: "臣密言：臣以险衅，夙遭闵凶。生孩六月，慈父见背；行年四岁，舅夺母志。祖母刘愍臣孤弱，躬亲抚养。臣少多疾病，九岁不行，零丁孤苦，至于成立。既无伯叔，终鲜兄弟，门衰祚薄，晚有儿息。外无期功强近之亲，内无应门五尺之僮，茕茕孑立，形影相吊。而刘夙婴疾病，常在床蓐，臣侍汤药，未曾废离。",
      },
    ])
// 弹窗
    const dialogstatus = ref(false)
    const dialogdata = ref(null)

// 点击卡片
    const openitem = (item) => {
      dialogstatus.value = true
      dialogdata.value = item
    }
// 关闭弹窗前的回调
    const guanbi = () => {
      dialogdata.value = null
    }
// 复制成功和失败回调
    const chenggong = (value, event) => {
      message.success(`"${value}"复制成功`)
    }
    const shibai = (value, event) => {
      message.error(`复制失败，浏览器不支持`)
    }

    const searchtext = ref("")
    const fenlei = ref("")
    const options = ref([
      {label: "姓名", value: "name"},
      {label: "电话", value: "phone"},
      {label: "地址", value: "address"},
    ])

// 初始化区域
    if (!fenlei.value) {
      fenlei.value = options.value[0].value
    }
    console.log("通讯录初始化")
    return {
      addresses, dialogstatus, dialogdata, openitem, guanbi, chenggong, shibai, searchtext, fenlei, options,
    }
  }
})
</script>
<style scoped>

</style>
